<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>关于我们---页面管理</title>
<link rel="stylesheet" type="text/css" href="../layui/css/layui.css" />
<script src="../layui/layui.js" type="text/javascript" charset="utf-8"></script>
</head>
<body class="layui-layout-body">
	<h3>留言表</h3>
	<table id="demo2" lay-filter="test2" action="" method="post">
	</table>
	<script type="text/html" id="toolbarDemo1">
			<div class="layui-btn-container">
		    <button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
		  </div>
		</script>
	<script type="text/html" id="toolbarDemo2">
			<div class="layui-btn-container">
		   
		    <button class="layui-btn layui-btn-sm" lay-event="delete">删除</button>
		    <button class="layui-btn layui-btn-sm" lay-event="update">编辑</button>
		  </div>
		</script>
	<!-- 设计师修改 -->
	<div id="updateDiv2" style="display: none;">
		<form class="layui-form" lay-filter="updateForm" method="post">
			<div class="layui-form-item">
				<label class="layui-form-label">修改id</label>
				<div class="layui-input-inline">
					<input type="text" name="id" id="id" required lay-verify="required"
						placeholder="请输入标题" autocomplete="off"
						class="layui-input layui-disabled">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">名字</label>
				<div class="layui-input-inline">
					<input type="text" name="name" id="name" required
						lay-verify="required" placeholder="请输入标题" autocomplete="off"
						class="layui-input layui-disabled">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">电话</label>
				<div class="layui-input-inline">
					<input type="text" name="telephone" id="telephone" required
						lay-verify="required" placeholder="请输入标题" autocomplete="off"
						class="layui-input layui-disabled">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">邮箱</label>
				<div class="layui-input-inline">
					<input type="text" name="email" id="email" required
						lay-verify="required" placeholder="请输入标题" autocomplete="off"
						class="layui-input layui-disabled">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">回复</label>
				<div class="layui-input-inline">
					<input type="text" name="text" id="text" required
						lay-verify="required" placeholder="请输入标题" autocomplete="off"
						class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="subBtn2">立即提交</button>

				</div>
			</div>
		</form>
	</div>


	<script>
		layui.use('upload', function() {
			var upload = layui.upload;
			var $ = layui.$
			layui.use('table', function() {
				var table = layui.table;
				var $ = layui.$;
				var upload = layui.upload;
				var form = layui.form;
				table.render({
					elem : '#demo2',
					url : 'AboutServletadmin?method=doliuyan' //数据接口
					,
					id : "sheji",
					page : true //开启分页
					,
					method : "post",
					cols : [ [ //表头
					{
						field : 'id',
						title : 'id',
						width : 80
					}, {
						field : 'name',
						title : 'name',
						width : 80
					}, {
						field : 'telephone',
						title : '电话',
						width : 150
					}, {
						field : 'email',
						title : '字段3',
						width : 150
					}, {
						field : 'contentt',
						title : '字段3',
						width : 150,

					}, {
						field : 'text',
						title : '回复',
						width : 150
					}, {
						title : '操作',
						toolbar : '#toolbarDemo2'
					}

					] ]
				});
				//监听设计师头部工具栏
				table.on('toolbar(test2)', function(obj) {
					switch (obj.event) {
					case 'add':
						layer.open({
							type : 1,
							btnAlign : 'c',
							area : [ '500px', '600px' ],
							content : $('#updateDiv3')
						});
						break;

					}
					;
				});
				//监听行内设计师表
				table.on('tool(test2)', function(obj) {
					var data = obj.data;
					switch (obj.event) {
					case 'delete':
						layer.confirm('真的删除么', function(index) {
							obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
							layer.close(index);//向服务端发送删除指令
							$.post("AboutServletadmin?method=deleteliuyan", {
								"id" : data.id
							}, function(res) {
								layer.msg(res.msg);
							}, "json")
						});
						break;
					case 'update':

						layer.open({
							type : 1,
							area : [ '500px', '600px' ],
							content : $('#updateDiv2')
						});
						form.val("updateForm", data);
						$("#showImg").attr("src", "../" + data.url)

						break;
					}
					;
				});
				//修改留言
				form.on('submit(subBtn2)', function(data) {
					$.post("AboutServletadmin?method=updateliuyan", data.field,
							function(res) {
								console.log(res);
								if (res.code == 0) {
									layer.msg(res.msg, {
										time : 1000
									}, function() {
										layer.closeAll();
										table.reload("sheji", {});
									})
								}
							}, "json")
					return false;
				});

			});
		});
	</script>
</body>
</html>